<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
    <%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="f" %>
<html>
<head>                
<script type="text/javascript" src="/three/lib/jquery/1.9.1/jquery.min.js"></script>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="/three/lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="/three/lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="/three/static/h-ui/js/H-ui.min.js"></script> 
<script type="text/javascript" src="/three/static/h-ui.admin/js/H-ui.admin.js"></script>
<!--footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="/three/lib/My97DatePicker/4.8/WdatePicker.js"></script> 
<script type="text/javascript" src="/three/lib/datatables/1.10.0/jquery.dataTables.min.js"></script> 
<script type="text/javascript" src="/three/lib/laypage/1.2/laypage.js"></script>
<!--[if lt IE 9]>
<script type="text/javascript" src="lib/html5shiv.js"></script>
<script type="text/javascript" src="lib/respond.min.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="/three/static/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="/three/static/h-ui.admin/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css" href="/three/lib/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css" href="/three/static/h-ui.admin/skin/default/skin.css" id="skin" />
<link rel="stylesheet" type="text/css" href="/three/static/h-ui.admin/css/style.css" />
<!--[if IE 6]>
<script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
<title>员工管理</title>
</head>
<script type="text/javascript">
  $(function(){
	  $('.table-sort').dataTable({
			"aaSorting": [[ 1, "desc" ]],//默认第几个排序
			"bStateSave": true,//状态保存
			"pading":false,
			"aoColumnDefs": [
			  //{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
			  {"orderable":false,"aTargets":[0,2]}// 不参与排序的列
			]
		});
  })
   function info(username,account,sex,mobile,bornDate,idno,address,postName,photo){
	     $("#t1").html(username);
	     $("#t2").html(account);
	     $("#t3").html(sex);
	     $("#t4").html(mobile);
	     $("#t5").html(bornDate);
	     $("#t6").html(idno);
	     $("#t7").html(address);
	     $("#t8").html(postName);
	     $("#img1").attr("src",photo);
	     $("#myModal").modal('show');
   }
</script>
<body>
<!-- Modal state -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header" style="background-color: red;">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel"><b><font color="blue">员工详细信息</font></b></h4>
      </div>
      <div class="modal-body">
        <table class="table table-striped" style="width: 560px;border-color: red;height: 280px;" border="1">
        <tbody>
        <tr height="60">
            <td width="100px"><b>员工照片:</b></td>
            <td><img width="70" height="50" src="" id="img1"></td>
          </tr>
          <tr>
            <td width="100px"><b>员工姓名:</b></td>
            <td id="t1"></td>
          </tr>
          <tr>
            <td width="100px"><b>员工账号:</b></td>
            <td id="t2"></td>
          </tr>
          <tr>
            <td width="100px"><b>性别:</b></td>
            <td id="t3"></td>
          </tr>
          <tr>
            <td width="100px"><b>职位:</b></td>
            <td id="t8"></td>
          </tr>
          <tr>
            <td width="100px"><b>手机号码:</b></td>
            <td id="t4">$</td>
          </tr>
          <tr>
            <td width="100px"><b>员工生日:</b></td>
            <td id="t5"></td>
          </tr>
          <tr>
            <td width="100px"><b>身份证号码:</b></td>
            <td id="t6"></td>
          </tr>
          <tr>
            <td><b>住址:</b></td>
            <td id="t7"></td>
          </tr>
        </tbody>
         </table>
      </div>
      <div class="modal-footer">
            <a class="btn btn-danger radius" data-dismiss="modal"><i class="Hui-iconfont">&#xe706;</i> 关闭</a>
      </div>
    </div>
  </div>
</div>
<!-- Modal end -->
<nav class="breadcrumb"><a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a></nav>
<div class="pd-20"></div>
  <div class="text-c"> 
  <form action="/three/shopUser/show" method="post" id="form1">
  <table style="width: 1000px;" align="center">
    <tr>
     <td>姓名:</td>
      <td><input type="text" class="input-text" name="bisname" style="width:150px" value="${bisname }"></td>
       <td>员工账号:</td>
      <td><input class="input-text" id="" name="bisaccount" style="width:150px" type="text" value="${bisaccount }"></td>
      <td>职位:</td>
      <td><span class="select-box inline">
		<select class="select" id="opt1" name="postEmp" style="width:120px">
			<option value="">请选择</option>
			<c:forEach items="${bisShopPosts}" var="post">
         <option value="${post.postCode }" ${post.postCode==postEmp?"selected":""}>${post.postName}</option>
         </c:forEach>
		</select>
		</span></td>
    </tr>
    <tr height="20px"></tr>
    <tr>
    <td>工号:</td>
    <td><input type="text" class="input-text" name="workNumber" style="width:150px" value="${workNumber }"></td>
    <td>手机号:</td>
    <td><input type="text" name="phone" class="input-text" value="${phone }" style="width:150px"></td>
    <td>入职时间:</td>
    <td><input type="text" onfocus="WdatePicker({maxDate:'#F{$dp.$D(\'datemax\')||\'%y-%M-%d\'}'})" id="datemin" class="input-text Wdate" style="width:120px;" name="stateDate" value="${stateDate }">
       至:
    <input type="text" onfocus="WdatePicker({minDate:'#F{$dp.$D(\'datemin\')}',maxDate:'%y-%M-%d'})" id="datemax" class="input-text Wdate" style="width:120px;" name="endDate" value="${endDate }">
    </td>
    <td><button type="submit" class="btn btn-success" id="" name=""><i class="Hui-iconfont">&#xe665; 查询</i></button>
 &nbsp;&nbsp;
 <button type="reset" class="btn btn-success" id="resetBut" name=""><i class="Hui-iconfont">&#xe66b; 重置 </i></button>
  </td>
    </tr>
  </table>
  </form>
  </div>
  <br>
  <div class="cl pd-5 bg-1 bk-gray mt-20"><span class="r">共有数据：<b><strong style="color: red;">${bisShopList.size()}</strong></b></h3> 条</span></div>
  <table class="table table-border table-bordered table-hover table-bg table-sort">
    <thead>
      <tr class="text-c">
        <th>照片</th>
        <th width="50">编号</th>
        <th width="80">姓名</th>
        <th width="100">员工账号</th>
        <th width="40">性别</th>
        <th width="90">工号</th>
        <th width="150">职位名称</th>
        <th width="">手机号</th>
        <th width="130">入职时间</th>
        <th width="100">操作</th>
      </tr>
    </thead>
    <tbody>
    <c:forEach items="${bisShopList }" var="bis">
      <tr class="text-c">
        <td><img width="70" height="50" src="http://localhost:8080/three${bis.photo }"></td>
        <td>${bis.shopUserId }</td>
        <td>${bis.username }</td>
        <td>${bis.account }</td>
        <td><c:if test="${bis.sex=='1'}">男</c:if>
            <c:if test="${bis.sex=='2'}">女</c:if>
            <c:if test="${bis.sex=='0'}">保密</c:if>
        </td>
        <td>${bis.workNumber}</td>
        <td class="user-status">${bis.bisShopPost.postName}</td>
        <td>${bis.mobile }</td>                                                                                                                                                                                 
        <td><f:formatDate value="${bis.entryDate }" pattern="yyyy-MM-dd"/></td>                 
        <td class="f-14 user-manage" id="td1"><input type="button" class="btn btn-primary size-L radius" onclick="info('${bis.username}','${bis.account}','<c:if test="${bis.sex=='1'}">男</c:if><c:if test="${bis.sex=='2'}">女</c:if><c:if test="${bis.sex=='0'}">保密</c:if>','${bis.mobile }','<f:formatDate value="${bis.bornDate }" pattern="yyyy年MM月dd日"/>','${bis.idno }','${bis.address }','${bis.bisShopPost.postName}','${bis.photo }')" value="详情"></td>
      </tr>
      </c:forEach>
    </tbody>
  </table>
  </body>
</html>
